{% extends 'base_page.html' %}


{% block title %}
    情感分析
{% endblock %}


{% block  nav %}
    <nav class="iq-sidebar-menu">
        <ul id="iq-sidebar-toggle" class="side-menu">
            <li class="px-3 pt-3 pb-2 ">
                <span class="text-uppercase small font-weight-bold">首页</span>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/home" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"></path>
                        </svg>
                    </i>
                    <span class="ml-2">首页</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/articleData" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"></path>
                        </svg>
                    </i>
                    <span class="ml-2">微博文章</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/commentsData" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M17,16V3L13,5,10,3,7,5,3,3V17.83A3.13,3.13,0,0,0,5.84,21,3,3,0,0,0,9,18V17a1,1,0,0,1,1-1H20a1,1,0,0,1,1,1v1a3,3,0,0,1-3,3H6"></path>
                        </svg>
                    </i>
                    <span class="ml-2">微博评论</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/topic" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"></path>
                        </svg>
                    </i>
                    <span class="ml-2">微博热门话题</span>
                </a>
            </li>
            <li class="px-3 pt-3 pb-2 ">
                <span class="text-uppercase small font-weight-bold">数据分析</span>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/articleChar" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M10 6H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V8a2 2 0 00-2-2h-5m-4 0V5a2 2 0 114 0v1m-4 0a2 2 0 104 0m-5 8a2 2 0 100-4 2 2 0 000 4zm0 0c1.306 0 2.417.835 2.83 2M9 14a3.001 3.001 0 00-2.83 2M15 11h3m-3 4h2"></path>
                        </svg>
                    </i>
                    <span class="ml-2">文章分析</span>
                </a>
            </li>
            <li class="active sidebar-layout">
                <a href="/page/yuqingChar" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
                        </svg>
                    </i>
                    <span class="ml-2">情感分析</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/analysisTopic" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"></path>
                        </svg>
                    </i>
                    <span class="ml-2">热门话题分析</span>
                </a>
            </li>
            <li class="px-3 pt-3 pb-2">
                <span class="text-uppercase small font-weight-bold">数据管理</span>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/spiderData" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"></path>
                        </svg>
                    </i><span class="ml-2">爬取数据</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/articleData_temp" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"></path>
                        </svg>
                    </i><span class="ml-2">爬取结果</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/updateData" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M8 13v-1m4 1v-3m4 3V8M8 21l4-4 4 4M3 4h18M4 4h16v12a1 1 0 01-1 1H5a1 1 0 01-1-1V4z"></path>
                        </svg>
                    </i><span class="ml-2">文章数据更新</span>
                </a>
            </li>
            <li class=" sidebar-layout">
                <a href="/page/deleteData" class="svg-icon">
                    <i class="">
                        <svg xmlns="http://www.w3.org/2000/svg" width="18" fill="none" viewbox="0 0 24 24"
                             stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                  d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"></path>
                        </svg>
                    </i><span class="ml-2">数据删除</span>
                </a>
            </li>
        </ul>
    </nav>
{% endblock %}


{% block content %}
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 mb-4 mt-1">
                <div class="d-flex flex-wrap justify-content-between align-items-center">
                    <h3 class="font-weight-bold text-danger">消极 Top10</h3>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive">
                            <div id="datatable-1_wrapper" class="dataTables_wrapper dt-bootstrap4">
                                <div class="row">
                                    <table id="datatable-3"
                                           class="table data-table table-striped table-bordered dataTable" role="grid"
                                           aria-describedby="datatable-1_info">
                                        <thead>
                                        <tr>
                                            <th style="font-weight: bold" class="text-center">
                                                文章ID
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                点赞量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                评论量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                类型
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                作者
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                内容
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                消极占比
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                详情
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for article in negative_articleList %}
                                            <tr class="even">
                                                <td style="width:10%" class="sorting_1">{#文章id#}
                                                    <a href="{{ article[8] }}" target="_blank">
                                                        {{ article[0] }}
                                                    </a>
                                                </td>
                                                {#点赞量#}
                                                <td style="width:10%" class="text-center">👍{{ article[1] }}</td>
                                                {#评论量#}
                                                <td style="width:10%" class="text-center">🔥{{ article[2] }}</td>
                                                {#类型#}
                                                <td style="width:8%" class="text-center">{{ article[7] }}</td>
                                                {#作者#}
                                                <td style="width:10%" class="text-left">
                                                    <a href="{{ article[10] }}" target="_blank">
                                                        {{ article[9] }}
                                                    </a>
                                                </td>
                                                {#内容#}
                                                <td style="" class="text-left">
                                                    {% if article[5]|length > 100 %}
                                                        {{ article[5][:100] }}......
                                                    {% else %}
                                                        {{ article[5] }}
                                                    {% endif %}
                                                </td>
                                                {#消极占比#}
                                                <td style="width:10%"
                                                    class="font-weight-bold text-danger text-center">{{ article[11] }}%
                                                </td>
                                                {#详情#}
                                                <td style="width:8%"><a
                                                        href="/page/articleChar?articleId={{ article[0] }}"
                                                        class="btn btn-primary btn-sm"
                                                        target="_blank">详情</a></td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>


    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 mb-4 mt-1">
                <div class="d-flex flex-wrap justify-content-between align-items-center">
                    <h3 class="font-weight-bold ">中性 Top10</h3>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive">
                            <div id="datatable-1_wrapper" class="dataTables_wrapper dt-bootstrap4">
                                <div class="row">
                                    <table id="datatable-4"
                                           class="table data-table table-striped table-bordered dataTable" role="grid"
                                           aria-describedby="datatable-1_info">
                                        <thead>
                                        <tr>
                                            <th style="font-weight: bold" class="text-center">
                                                文章ID
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                点赞量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                评论量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                类型
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                作者
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                内容
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                中性占比
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                详情
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for article in neutral_articleList %}
                                            <tr class="even">
                                                <td style="width:10%" class="sorting_1">{#文章id#}
                                                    <a href="{{ article[8] }}" target="_blank">
                                                        {{ article[0] }}
                                                    </a>
                                                </td>
                                                {#点赞量#}
                                                <td style="width:10%" class="text-center">👍{{ article[1] }}</td>
                                                {#评论量#}
                                                <td style="width:10%" class="text-center">🔥{{ article[2] }}</td>
                                                {#类型#}
                                                <td style="width:8%" class="text-center">{{ article[7] }}</td>
                                                {#作者#}
                                                <td style="width:10%" class="text-left">
                                                    <a href="{{ article[10] }}" target="_blank">
                                                        {{ article[9] }}
                                                    </a>
                                                </td>
                                                {#内容#}
                                                <td style="" class="text-left">
                                                    {% if article[5]|length > 100 %}
                                                        {{ article[5][:100] }}......
                                                    {% else %}
                                                        {{ article[5] }}
                                                    {% endif %}
                                                </td>
                                                {#情绪占比#}
                                                <td style="width:10%"
                                                    class="font-weight-bold text-center">{{ article[12] }}%
                                                </td>
                                                {#详情#}
                                                <td style="width:8%"><a
                                                        href="/page/articleChar?articleId={{ article[0] }}"
                                                        class="btn btn-primary btn-sm"
                                                        target="_blank">详情</a></td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 mb-4 mt-1">
                <div class="d-flex flex-wrap justify-content-between align-items-center">
                    <h3 class="font-weight-bold text-green">积极 Top10</h3>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive">
                            <div id="datatable-1_wrapper" class="dataTables_wrapper dt-bootstrap4">
                                <div class="row">
                                    <table id="datatable-5"
                                           class="table data-table table-striped table-bordered dataTable" role="grid"
                                           aria-describedby="datatable-1_info">
                                        <thead>
                                        <tr>
                                            <th style="font-weight: bold" class="text-center">
                                                文章ID
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                点赞量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                评论量
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                类型
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                作者
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                内容
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                积极占比
                                            </th>
                                            <th style="font-weight: bold" class="text-center">
                                                详情
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        {% for article in positive_articleList %}
                                            <tr class="even">
                                                <td style="width:10%" class="sorting_1">{#文章id#}
                                                    <a href="{{ article[8] }}" target="_blank">
                                                        {{ article[0] }}
                                                    </a>
                                                </td>
                                                {#点赞量#}
                                                <td style="width:10%" class="text-center">👍{{ article[1] }}</td>
                                                {#评论量#}
                                                <td style="width:10%" class="text-center">🔥{{ article[2] }}</td>
                                                {#类型#}
                                                <td style="width:8%" class="text-center">{{ article[7] }}</td>
                                                {#作者#}
                                                <td style="width:10%" class="text-left">
                                                    <a href="{{ article[10] }}" target="_blank">
                                                        {{ article[9] }}
                                                    </a>
                                                </td>
                                                {#内容#}
                                                <td style="" class="text-left">
                                                    {% if article[5]|length > 100 %}
                                                        {{ article[5][:100] }}......
                                                    {% else %}
                                                        {{ article[5] }}
                                                    {% endif %}
                                                </td>
                                                {#情绪占比#}
                                                <td style="width:10%"
                                                    class="font-weight-bold text-green text-center">{{ article[13] }}%
                                                </td>
                                                {#详情#}
                                                <td style="width:8%"><a
                                                        href="/page/articleChar?articleId={{ article[0] }}"
                                                        class="btn btn-primary btn-sm"
                                                        target="_blank">详情</a></td>
                                            </tr>
                                        {% endfor %}
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>


    <style>
        .table td {
            word-wrap: break-word;
            word-break: break-all;
            white-space: normal;
        }
    </style>
{% endblock %}


{% block echarts %}

{% endblock %}